<template>
  <div class="c-pf c-p-t0 c-p-l0 c-p-r0 c-m-0auto c-w100 c-h c-translucent-balck80 c-pz100000 c-maxw640" v-if="maskModel">
    <div class="c-pf c-p-t0 c-w100 c-h c-pz100 c-maxw640" @click="handleClickMask()"></div>
    <div class="mask_icon c-maxw640 c-pf iconfont icon-arrows-10-2 c-fs80 c-pz101 c-fc-white"></div>
    <div class="c-pf c-maxw640 c-w100 c-flex-column c-flex-center c-fc-white c-pz101 mask_tit">
      <div class="c-ww400">
        <div class="c-fs30 c-fw600 c-textAlign-c">{{defaultTit}}</div>
        <div class="c-mt16 c-fs26">{{txtContent}}</div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'ShareMask',
    props: {
      maskModel: {
        type: Boolean,
        default: false
      },
      defaultTit: {
        type: String,
        default: '立即分享给好友吧'
      },
      txtContent: {
        type: String,
        default: '点击屏幕右上角将本页分享给好友'
      }
    },
    methods: {
      handleClickMask() {
        this.$emit('handleClickMask')
      }
    }
  }
</script>

<style lang="less" scoped>
.mask_icon {
  top: .85rem;
  right: 1.85rem;
}
.mask_tit {
  top: 3.6rem;
}
</style>